<template>
  <ym-router
    layer="layout"
    id="app"
  />
</template>
<script>

export default {
  async mounted () {
    /**
     * 显示提示框
     */
    this.$http.beforeSend(this, async (action) => {
      try {
        // 显示提示框
        if (action.confirm) return await this.$confirm(action.confirm)
        return true
      } catch (e) {
        return false
      }
    })

    const fnRedirect = async (action, value = {}) => {
      if (!action || !action.redirect) return true

      const redirect = action.redirect
      const url = redirect.url || (redirect + '')
      const layer = redirect.layer || 'main'
      await this.$store.dispatch('reViewByUrl', {
        url, layer, value
      })
      return false
    }

    /**
     * 跳转拦截 内部跳转通过$store重新发送
     */
    this.$http.beforeSend(this, async (action, value) => {
      // 跳转
      return await fnRedirect(action, value)
    })

    /**
     * 响应消息提示
     */
    this.$http.onReceive(this, async (response) => {
      if (response && response.message) {
        this.$message({
          message: response.message.text,
          type: response.message.type
        })
      }
      return await fnRedirect(response)
    })

    /**
     * 拦截错误并显示
     */
    this.$http.onException(this, (e) => {
      this.$message({
        message: e + '',
        type: 'error'
      })
    })

    const url = this.$store.state.url
    await this.$store.dispatch('reViewByUrl', {
      url, layer: 'layout'
    })
  }
}
</script>

<style>
* {
  border: 0;
  padding: 0;
  margin: 0;
}

html {
  height: 100%;
  box-sizing: border-box;
}

body {
  height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei,  "微软雅黑", Arial, sans-serif;
}

#app {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}

.el-menu {
  border-right: 0;
}

.el-menu .el-menu-item span {
  font-size: 12px;
}

label {
  font-weight: 700;
}

.title {
  margin-bottom: 20px;
  padding-left: 5px;
}
</style>
